<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/shopping.css">
    <link rel="stylesheet" href="./font/iconfont.css">
</head>
<body>
    <div id="header">
        <div class="h_inner container">
            <div class="box">
                <a href="#"><i class="iconfont icon-loc-s"></i><span>广东</span></a>
                <ul>
                    <li><a href="#">北京</a></li>
                    <li><a href="#">上海</a></li>
                    <li><a href="#">天津</a></li>
                    <li><a href="#">重庆</a></li>
                    <li><a href="#">河北</a></li>
                    <li><a href="#">山西</a></li>
                    <li><a href="#">河南</a></li>
                    <li><a href="#">辽宁</a></li>
                    <li><a href="#">吉林</a></li>
                    <li><a href="#">黑龙江</a></li>
                    <li><a href="#">内蒙古</a></li>
                    <li><a href="#">江苏</a></li>
                    <li><a href="#">山东</a></li>
                    <li><a href="#">安徽</a></li>
                    <li><a href="#">浙江</a></li>
                    <li><a href="#">福建</a></li>
                    <li><a href="#">湖北</a></li>
                    <li><a href="#">湖南</a></li>
                    <li><a href="#">广东</a></li>
                    <li><a href="#">广西</a></li>
                    <li><a href="#">江西</a></li>
                    <li><a href="#">四川</a></li>
                    <li><a href="#">海南</a></li>
                    <li><a href="#">贵州</a></li>
                    <li><a href="#">云南</a></li>
                    <li><a href="#">西藏</a></li>
                    <li><a href="#">陕西</a></li>
                    <li><a href="#">甘肃</a></li>
                    <li><a href="#">青海</a></li>
                    <li><a href="#">宁夏</a></li>
                    <li><a href="#">新疆</a></li>
                    <li><a href="#">港澳</a></li>
                    <li><a href="#">台湾</a></li>
                    <li><a href="#">钓鱼岛</a></li>
                    <li><a href="#">海外</a></li>
                </ul>
            </div>
            <div class="nav">
                    <a href="#" class="a_login">你好，请登录</a><span>|</span>
                    <a href="#" class="a_register">免费注册</a><span>|</span>
                    <div class="user_box"><a href="#" class="a_box"><b class="user_id"></b>的京东<i class="iconfont icon-kefu"></i></a><span>|</span><ul class="user_more">
                        <dl><dt><img src="./images/plus.png" alt=""></dt><dd>PLUS会员</dd></dl>
                        <dl><dt><img src="./images/plus02.png" alt=""></dt><dd>运费减免</dd></dl>
                        <dl><dt><img src="./images/plus03.png" alt=""></dt><dd>生日特权</dd></dl>
                        <span class="exit">退出</span>
                    </ul></div>
                    <a href="#">我的订单</a><span>|</span>
                    <div class="n_box"><a href="#" class="a_box">我的京东</a><span>|</span><ul>
                        <li><a href="#">待处理订单</a></li>
                        <li><a href="#">消息</a></li>
                        <li><a href="#">返修退换货</a></li>
                        <li><a href="#">我的问答</a></li>
                        <li><a href="#">降价商品</a></li>
                        <li><a href="#">我的关注</a></li>
                        <li><a href="#">我的京豆</a></li>
                        <li><a href="#">我的优惠券</a></li>
                        <li><a href="#">我的白条</a></li>
                        <li><a href="#">我的理财</a></li>
                    </ul></div>
                    <a href="#">京东会员</a><span>|</span>
                    <div class="n_box"><a href="#" class="a_box">企业采购</a><span>|</span><ul>
                        <li><a href="#">待处理订单</a></li>
                        <li><a href="#">消息</a></li>
                        <li><a href="#">返修退换货</a></li>
                        <li><a href="#">我的问答</a></li>
                        <li><a href="#">降价商品</a></li>
                        <li><a href="#">我的关注</a></li>
                        <li><a href="#">我的京豆</a></li>
                        <li><a href="#">我的优惠券</a></li>
                        <li><a href="#">我的白条</a></li>
                        <li><a href="#">我的理财</a></li>
                    </ul></div>
                    <div class="n_box"><a href="#" class="a_box">客户服务</a><span>|</span><ul class="u_right">
                        <li><a href="#">待处理订单</a></li>
                        <li><a href="#">消息</a></li>
                        <li><a href="#">返修退换货</a></li>
                        <li><a href="#">我的问答</a></li>
                        <li><a href="#">降价商品</a></li>
                        <li><a href="#">我的关注</a></li>
                        <li><a href="#">我的京豆</a></li>
                        <li><a href="#">我的优惠券</a></li>
                        <li><a href="#">我的白条</a></li>
                        <li><a href="#">我的理财</a></li>
                    </ul></div>
                    <a href="#">网站导航</a><span>|</span>
                    <a href="#">手机京东</a>
            </div>
        </div>
    </div>
    <div id="nav">
        <div class="n_inner container clearfix">
            <div class="img"><a href="./index.html">京东</a></div>
            <div class="box">
                    <input type="text" placeholder="电动自行车" class="search">
                    <input type="button" class="btn"><i class="iconfont icon-sousuo sea"></i>
            </div>
        </div>    
    </div>
    <div id="main">
        <div class="m_inner container">
            <div class="m_top">
                <div class="total">
                    <h2>全部商品</h2><span></span>
                </div>
                <div class="path">
                    <p>配送至：</p>
                        <select name="city">
                        <option value="福建">福建莆田</option>
                        <option value="厦门">厦门岛内</option>
                        <option value="莆田">莆田涵江</option>
                        <option value="泉州">泉州</option>
                        <option value="福州">福州</option>
                    </select>
                </div>
            </div>
            <div class="m_head">
                <div class="select_all">
                    <input type="checkbox" name="select_all">
                    全选
                </div>
                <p class="nolef">商品</p>
                <p class="p1">单价</p>
                <p class="p2">数量</p>
                <p class="p3">小计</p>
                <p class="p4">操作</p>
            </div>
            <div class="m_title">
                <div class="select_all">
                    <input type="checkbox">
                    <span>京东自营</span>
                </div>
                <img src="./images/cart01.png" alt="">
                <div class="tit_rig">
                    <i class="iconfont icon-chenggong"></i>
                    <b>已免运费</b>
                    <a href=""><p>开通PLUS每月领5张运费券></p></a>
                </div>
            </div>
            <div class="list">
                <!-- <div class="item">
                    <div class="select_all">
                        <input type="checkbox">
                    </div>
                    <div class="item_info">
                        <img src="./images/img10.png" alt="">
                        <a href="" title="雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标">雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标</a>
                    </div>
                    <div class="item_price">
                        <span class="price">￥99.00</span>
                    </div>
                    <div class="item_num"><span class="del">-</span><input class="num" min="1" max="200" value="1"><span class="add">+</span></div>
                    <div class="item_total">
                        <span class="t_price">￥99.00</span>
                    </div>
                    <div class="item_delete">删除</div>
                </div>
                <div class="item">
                    <div class="select_all">
                        <input type="checkbox">
                    </div>
                    <div class="item_info">
                        <img src="./images/img10.png" alt="">
                        <a href="" title="雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标">雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标</a>
                    </div>
                    <div class="item_price">
                        <span class="price">￥99.00</span>
                    </div>
                    <div class="item_num"><span class="del">-</span><input class="num" min="1" max="200" value="1"><span class="add">+</span></div>
                    <div class="item_total">
                        <span class="t_price">￥99.00</span>
                    </div>
                    <div class="item_delete">删除</div>
                </div> -->
            </div>
            <div class="m_bottom">
                <div class="select_all">
                    <input type="checkbox" name="select_all">
                    全选
                </div>
                <p class="p1">删除选中的产品</p>
                <p class="p2">移入关注</p>
                <p class="p3">清空购物车</p>
                <p class="p4">已选择<span class="total_number">0</span>件商品</p>
                <p class="p5">总价：<span class="total_price">0</span>元</p>
                <span class="buy">去结算</span>
            </div>
            <div class="like">
                <div class="like_title"><img src="./images/cart02.png" alt=""></div>
                <div class="like_inner">
                    <div class="item">
                        <div class="item_info">
                            <img src="./images/img10.png" alt="" class="his_img">
                            <!-- <a href="" title="雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标">雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标</a><br>
                            <p class="price">￥99.00</p> -->
                            <h2>浏览历史</h2>
                        </div>
                    </div>
                    <div class="dl_box">
                        <!-- <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl> -->
                    </div>
                    
                </div>
                <div class="like_inner">
                    <div class="item">
                        <div class="item_info">
                            <img src="./images/img08.png" alt="" class="his_img">
                            <!-- <a href="" title="雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标">雷神（ThundeRobot）无线游戏鼠标ML201 长续航 10米远距离传输无线游戏鼠标</a><br>
                            <p class="price">￥99.00</p> -->
                            <h2>爆款推荐</h2>
                        </div>
                    </div>
                    <div class="dl_box1">
                        <!-- <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl>
                        <dl>
                            <dt><img src="./images/cart03.jpg" alt=""></dt>
                            <dd><p>雷蛇 Razer 巴塞利斯蛇 X 极速版 小巴蛇 鼠标 无线鼠标 游戏鼠标 右手鼠标 电竞 双无线模式 黑色 16000DPI</p><img src="./images/cart04.png" alt=""></dd>
                        </dl> -->
                    </div>
                    
                </div>
            </div>
        </div>
    </div>

    <div id="footer">
        <div class="f_inner container">
            <div class=f_top01><i></i>
                <p>品类齐全,轻松购物</p>
            </div>
            <div class=f_top02><i></i>
                <p>多仓直发,极速配送</p>
            </div>
            <div class=f_top03><i></i>
                <p>正品行货,精致服务</p>
            </div>
            <div class=f_top04><i></i>
                <p>天天低价,畅选无忧</p>
            </div>
        </div>
    </div>
    <div id="fnav">
        <div class="fna_in container">
            <div class="fn_box">
                <dl>
                    <dt>购物指南</dt>
                    <dd><a href=#>购物流程</a></dd>
                    <dd><a href=#>会员介绍</a></dd>
                    <dd><a href=#>生活旅行</a></dd>
                    <dd><a href=#>常见问题</a></dd>
                    <dd><a href=#>大家电</a></dd>
                    <dd><a href=#>联系客服</a></dd>
                </dl>
                <dl>
                    <dt>配送方式</dt>
                    <dd><a href=#>上门自提</a></dd>
                    <dd><a href=#>211限时达</a></dd>
                    <dd><a href=#>配送服务查询</a></dd>
                    <dd><a href=#>配送费收取标准</a></dd>
                    <dd><a href=#>海外配送</a></dd>
                </dl>
                <dl>
                    <dt>支付方式</dt>
                    <dd><a href=#>货到付款</a></dd>
                    <dd><a href=#>在线支付</a></dd>
                    <dd><a href=#>分期付款</a></dd>
                    <dd><a href=#>公司转账</a></dd>
                </dl>
                <dl>
                    <dt>售后服务</dt>
                    <dd><a href=#>售后政策</a></dd>
                    <dd><a href=#>价格保护</a></dd>
                    <dd><a href=#>退款说明</a></dd>
                    <dd><a href=#>返修/退换货</a></dd>
                    <dd><a href=#>取消订单</a></dd>
                </dl>
                <dl>
                    <dt>特色服务</dt>
                    <dd><a href=#>夺宝岛</a></dd>
                    <dd><a href=#>DIY装机</a></dd>
                    <dd><a href=#>延保服务</a></dd>
                    <dd><a href=#>京东E卡</a></dd>
                    <dd><a href=#>京东通信</a></dd>
                    <dd><a href=#>京鱼座智能</a></dd>
                </dl>
                <dl>
                    <dt>京东自营覆盖区县</dt>
                    <dd>京东已向全国2661个区县提供自营配送服务,支持货到付款.POS机刷卡和售后上门服务。<br><a href=#>查看详情></a></dd>
                </dl>
            </div>
            <ul class=aboutUs>
                <li><a href=#>关于我们</a><span>|</span></li>
                <li><a href=#>联系我们</a><span>|</span></li>
                <li><a href=#>联系客服</a><span>|</span></li>
                <li><a href=#>合作招商</a><span>|</span></li>
                <li><a href=#>商家帮助</a><span>|</span></li>
                <li><a href=#>营销中心</a><span>|</span></li>
                <li><a href=#>手机京东</a><span>|</span></li>
                <li><a href=#>友情链接</a><span>|</span></li>
                <li><a href=#>销售联盟</a><span>|</span></li>
                <li><a href=#>京东社区</a><span>|</span></li>
                <li><a href=#>风险监测</a><span>|</span></li>
                <li><a href=#>隐私政策</a><span>|</span></li>
                <li><a href=#>京东公益</a><span>|</span></li>
                <li><a href=#>English Site</a><span>|</span></li>
                <li><a href=#>Media & IR</a></li>
            </ul>
            <ul class=putOnRecords>
                <li><a href=#>京公网安备1100002000088号</a><span>|</span></li>
                <li><a href=#>京ICP证070359号</a><span>|</span></li>
                <li><a href=#>互联网药品信息服务资格证编号(京)经营性-2014-0008</a><span>|</span></li>
                <li><a href=#>新出发京零字第大120007号</a></li>
            </ul>
            <ul class=putOnRecords1>
                <li><a href=#>互联网出版许可证编号新出网证(京)字150号</a><span>|</span></li>
                <li><a href=#>出版物经营许可证</a><span>|</span></li>
                <li><a href=#>网络文化经营许可证京网文[2014]2148-348号</a><span>|</span></li>
                <li><a href=#>违法和不良信息举报电话:4006561155</a></li>
            </ul>
            <ul class=putOnRecords>
                <li><a href=#>Copyright @ 2004 - 2020京东JD.com版权所有</a><span>|</span></li>
                <li><a href=#>消费者维权热线:4006067733经营证照</a><span>|</span></li>
                <li><a href=#>(京)网械平台备字(2018)第00003号</a><span>|</span></li>
                <li><a href=#>营业执照</a></li>
            </ul>
            <ul class=putOnRecords2>
                <li><i></i><a href=#>Global Site</a><span>|</span></li>
                <li><i></i><a href=#>Сайт России</a><span>|</span></li>
                <li><i></i><a href=#>Situs Indonesia</a><span>|</span></li>
                <li><i></i><a href=#>Sitio de España</a><span>|</span></li>
                <li><i></i><a href=#>เว็บไซต์ประเทศไทย</a></li>
            </ul>
            <ul class=sub>
                <li>京东旗下网站：<a href=#>京东钱包</a><span>|</span></li>
                <li><a href=#>京东智联云</a></li>
            </ul>
            <img src="./images/fnal.png" alt="" class="finall">
        </div>
    </div>
    <script src="./js/jquery-3.5.1.js"></script>
    <script src="./js/layer/layer.js"></script>
    <script src="./js/tools.js"></script>
    <script src="./js/shopping.js"></script>
</body>
</html>